<template>
	<view class="nav-bar">
		<view class="left">
		<slot name="left"></slot>		
		</view>
		<view class="center">
			<slot name="center"></slot>
		</view>
		<view class="right">
			<slot name="right"></slot>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss" scoped>
.nav-bar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 98rpx;
	color: #FFFFFF;
	// padding: 0 30rpx;
	.left,
	.right{
		width: 120rpx;
		display: flex;
		justify-content: center;
	}
	.right {
		// width: 150rpx;
	}
	.center {
		flex: 1;
		display: flex;
		justify-content: center;
	}
}
</style>
